<template>
  <div>
    <h1>小头爸爸 父组件</h1>
    <da-tou @addItem="addItem"></da-tou>
  </div>
</template>

<script>
import DaTou from "./DaTou.vue";
export default {
  /* 要求 收集子组件传递过来的info 将收集过来的数据插入到list当中
    子组件收集info-----子传父---{} obj obj.title = info
    {title:info}
    list.push({title:info})
    list:[{ title: "汪涵很活泼" }, { title: "石松峰社牛plus" },{title:info}]  

    设计初始化数据时：
    如果是一个组件使用该数据 初始化数据就在该组件内部
    如果是多个组件使用该数据 初始化数据就设计在他们共同父级组件内

    数据在哪里处理数据的方法在哪里



    
    */
  data() {
    return {
      list: [{ title: "汪涵很活泼" }, { title: "石松峰社牛plus" }],
    };
  },
  components: {
    DaTou,
  },
  methods: {
    addItem(info) {
      const obj = {};
      obj.title = info;
      this.list.push(obj);
      console.log(this.list);
    },
  },
};
/* 
$emit(自定义事件) 子传父

理解的基础上去记忆
事件 click  change  keyup mouse
事件名 click 自定义事件 addItem
事件有对应的回调函数   @click = getInfo(){}  addItem
调用事件的方式 鼠标点击调用 this.$emit("addItem",要传递的参数)

任意组件传值 （父子或者兄弟）



*/
</script>

<style lang="less" scoped>
</style>